import React, { createContext, useReducer } from 'react';

export const ColorContext = createContext({})

export const CHANGE_COLOR = 'changeColor'

function reducer(state, action) {
    switch (action.type) {
        case CHANGE_COLOR:
            return action.color
        default:
            return state
    }
}

export const Color = props => {
    const [ color, dispatch ] = useReducer(reducer,"blue")
    return (
        <ColorContext.Provider value={{color,dispatch}}>
            {props.children}
        </ColorContext.Provider>
    )
}